package com.csw.compose.ui.module.compatible

import android.annotation.SuppressLint
import android.graphics.drawable.ColorDrawable
import android.view.Gravity
import android.widget.FrameLayout
import android.widget.TextView
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.verticalScroll
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.platform.ComposeView
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import androidx.compose.ui.viewinterop.AndroidView
import com.csw.compose.theme.pagePadding
import com.csw.compose.ui.Destination
import com.csw.compose.ui.components.BodyText
import com.csw.compose.ui.components.LabelText
import com.csw.compose.ui.components.LargeSpacer
import com.csw.compose.ui.components.NormalSpacer
import com.csw.compose.ui.components.PrimaryTitle
import com.csw.compose.ui.components.UlItem
import com.csw.compose.ui.module.BasePage

@Preview
@Composable
fun ViewComposePagePreview() {
    BasePage({}, "View Compose兼容") {
        ViewComposePage()
    }
}

class ViewComposePageData {
    companion object : Destination("ViewComposePage")
}

@SuppressLint("SetTextI18n")
@Composable
fun ViewComposePage() {
    Column(
        modifier = Modifier
            .padding(horizontal = pagePadding)
            .verticalScroll(rememberScrollState())
    ) {
        PrimaryTitle("简介")
        BodyText("Compose作为一个UI库，它可以与系统自带的View嵌套使用")
        NormalSpacer()

        AndroidView(
            {
                return@AndroidView FrameLayout(it).apply {
                    addView(TextView(context).apply {
                        text = "AndroidView"
                        background = ColorDrawable(android.graphics.Color.parseColor("#60FF0000"))
                        gravity = Gravity.BOTTOM
                    })

                    addView(ComposeView(context).apply {
                        setContent {
                            Box {
                                Text(
                                    "ComposeView",
                                    modifier = Modifier
                                        .size(150.dp)
                                        .background(Color(0, 0, 255, 20)),
                                    textAlign = TextAlign.Center,
                                    color = Color.White
                                )
                            }
                        }
                    })
                }
            },
            Modifier
                .fillMaxWidth()
                .height(200.dp)
        )

        NormalSpacer()
        UlItem("AndroidView")
        LabelText("Android View组件，用于在Compose组件中嵌入Android视图")
        LabelText("由于像WebView、SurfaceView、GLSurfaceView、TextureView等视图在Compose中没有对应的实现，通常需要借助AndroidView来嵌入Compose中")

        LargeSpacer()
        UlItem("ComposeView")
        LabelText("用于在View系统中嵌入Compose组件，以此实现互相兼容")

    }
}